<template>
  <div class="headdata">
    <div><img src="~assets/img/login.png" /></div>
    <div class="login">
      <div class="loginitem">登陆/注册</div>
      <div class="iphone">暂无绑定的手机号</div>
    </div>
    <div class="back"></div>
  </div>
</template>

<script>
export default {
  name:'headerdata'
}
</script>

<style scoped>
.headdata{
  margin-top:44px;
  display: flex;
  background-color:pink;
  padding: 15px 10px;
  justify-content: space-around;
}
.headdata img{
  width: 80px;
  height: 80px;
  border-radius: 50px;
}
.login{
  color: #fff;
  font-weight: bold;
  position: relative;
  top: 15px;
  right: 30px;
  font-size: 19px;  
}
.iphone{
  margin-top: 5px;
}
.iphone::before{
  width: 32px;
  height: 32px;
  content: '';
  display: inline-block;
  background: url('~assets/img/iphone.png');
  position: relative;
   vertical-align: middle;  
}
.loginitem{
  margin-left: 32px;
}
.back{
  margin-top: 20px;
 width: 32px;
 height: 32px;
 background: url('~assets/img/rightback.png') ;
}
</style>